<template>
  <div class="bg-gray-200" style="padding: 15px">
    <span>{{ translateTitle('Dams.ApplicationInterface.选择系统') }}:</span>
    <el-select v-model="itemSubSystem" :placeholder="translateTitle('Dams.ApplicationInterface.请选择')" @change="selectChange">
      <el-option v-for="item in systemOptions" :key="item.APP_CODE" :label="item.APP_NAME" :value="item.APP_CODE" />
    </el-select>
    <slot></slot>
    <!-- <el-upload action="#" :before-upload="beforeRemove" class="upload-demo" :file-list="fileList" :limit="3" multiple>
      <el-button size="small" type="primary">点击上传</el-button>
    </el-upload> -->
  </div>
</template>
<script>
  import cloneDeep from 'lodash/cloneDeep'
  import { translateTitle } from '@/utils/i18n'
  const XLSX = require('xlsx')
  export default {
    name: 'SystemSelect',
    props: {
      subSystem: {
        type: String,
        default: 'WMS',
      },
    },
    emits: ['selectChange'],
    data() {
      return {
        systemOptions: [],
        itemSubSystem: '',
        fileList: [],
      }
    },
    watch: {
      subSystem(val) {
        this.itemSubSystem = val
      },
    },
    created() {
      this.itemSubSystem = this.subSystem
      this.systemOptions = cloneDeep(this.$store.getters['user/apps'])
      let index = this.systemOptions.findIndex((el) => el.APP_CODE == 'DAMS')
      if (index > -1) {
        this.systemOptions.splice(index, 1)
      }
      let index1 = this.systemOptions.findIndex((el) => el.APP_CODE == 'BQMS')
      if (index1 > -1) {
        this.systemOptions.splice(index1, 1)
      }
      // let list = JSON.parse(sessionStorage.getItem('test'))
      // this.setTest(list)
    },
    methods: {
      translateTitle,
      setTest(list) {
        console.log(list)
        let fantiobj = {}
        let zhongwen = {}
        let yingwen = {}
        list[1].results.forEach((r, i) => {
          fantiobj[r[list[1].header[0]]] = list[0].results[i][list[0].header[0]]
          zhongwen[r[list[1].header[0]]] = list[1].results[i][list[1].header[0]]
          yingwen[r[list[1].header[0]]] = list[2].results[i][list[2].header[0]]
        })
        console.log(fantiobj)
        console.log(zhongwen)
        console.log(yingwen)
      },
      getHeaderRow(sheet) {
        const headers = []
        const range = XLSX.utils.decode_range(sheet['!ref'])
        let C
        const R = range.s.r
        for (C = range.s.c; C <= range.e.c; ++C) {
          const cell = sheet[XLSX.utils.encode_cell({ c: C, r: R })]
          let hdr = 'UNKNOWN ' + C // <-- replace with your desired default
          if (cell && cell.t) hdr = XLSX.utils.format_cell(cell)
          headers.push(hdr)
        }
        return headers
      },
      beforeRemove(file) {
        console.log(file)
        const reader = new FileReader()
        reader.onload = (file) => {
          const data = file.target.result
          const workbook = XLSX.read(data, { type: 'array' })
          const firstSheetName = workbook.SheetNames[0]
          const worksheet = workbook.Sheets[firstSheetName]
          const header = this.getHeaderRow(worksheet)
          const results = XLSX.utils.sheet_to_json(worksheet)
          console.log(header, results)
          this.fileList.push({ header, results })
          sessionStorage.setItem('test', JSON.stringify(this.fileList))
          console.log(this.fileList)
        }
        reader.readAsArrayBuffer(file)
      },
      selectChange(val) {
        this.$emit('selectChange', val)
      },
    },
  }
</script>
<style lang="scss" scoped>
  // :deep() {
  //   .el-select,
  //   .el-select--small {
  //     width: 300px !important;
  //   }
  // }
</style>
